<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .testBox .testItem{
            width: 100px;
            height: 100px;
            background: orange;
        }
    </style>
</head>
<body>
    <div class="testBox">
        <div class="testItem" onclick="fullScreen()">

        </div>
    </div>
    <div class="clipboardTest">
        <input type="text" id="copyInput">
        <button onclick="copyText()">复制</button>
        <input type="text" id="pastedInput">
        <button onclick="pastedText()">粘贴</button>
    </div>
</body>
<script>
    function fullScreen(){
        document.querySelector(".testItem").requestFullscreen();
    }

    var copyInput = document.querySelector("#copyInput");
    var pastedInput = document.querySelector("#pastedInput");

    async function copyText(){
        try{
            let a = await navigator.clipboard.writeText(copyInput.value);
            console.log(a);
        }catch(e){
            console.error("拒绝访问剪切板");
        }
    }

    async function pastedText(){
        try {
            let text = await navigator.clipboard.readText();
            pastedInput.value = text;
        } catch (error) {
            if(/firefox/.test(navigator.userAgent.toLowerCase())){
                alert("您的firefox安全限制限制您进行剪贴板操作，请打开’about:config’将signed.applets.codebase_principal_support’设置为true’之后重试。")
            }
            console.error("拒绝访问剪切板");
        }
    }

</script>
</html>